// 入口js

// 引入 React
import React, { Component } from "react";
// 引入 ReactDOM
import ReactDOM from "react-dom/client";

// 1. 定义一个函数式的App组件
//    1. 函数名就是组件名，首字母要大写
//    2. 需要返回 模板内容
function App() {
  return (
    <div>
      <h1>我是App</h1>
    </div>
  );
}

// 2. 定义一个类的组件
//    1. 类名就是组件名，首字母要大写
//    2. 需要继承 React.Component
//    3. 需要提供 render 函数，函数内，返回组件的 模板内容
class MyApp extends Component {
  // 提供一个render函数，函数里面返回 jsx
  render() {
    return (
      <div>
        <h1>我是 MyApp</h1>
      </div>
    )
  }
}


// 创建根元素
const root = ReactDOM.createRoot(document.querySelector('#root'))

// 渲染
root.render(
  <>
    <App />
    <MyApp />
  </>
)